<!DOCTYPE html>
<html>

<head>
    <title>{$Think.config.app_name}</title>
    {include file="public/head"/}
    <link rel="stylesheet" href="/static/admin/css/login.css" media="all">
</head>

<body class="layui-layout-body layadmin-user-login ">
    <div class="layadmin-tabspage-none root_box" v-cloak>
        <div class="layadmin-user-login-main">
            <div class="layadmin-user-login-box layadmin-user-login-header">
                <h2>请你登录</h2>
                <p>{$Think.config.app_name}</p>
            </div>
            <div class="layadmin-user-login-box layadmin-user-login-body layui-form">
                <div class="layui-form-item">
                    <label class="layadmin-user-login-icon layui-icon layui-icon-username"></label>
                    <input type="text" name="user_account" v-model="user_account" id="user_account" placeholder="请输入手机号"
                        class="layui-input">
                </div>
                <div class="layui-form-item">
                    <label class="layadmin-user-login-icon layui-icon layui-icon-password"></label>
                    <input type="password" name="user_password" v-model="user_password" id="user_password"
                        placeholder="请输入密码" class="layui-input">
                </div>
                <div class="layui-form-item">
                    <div class="layui-row">
                        <div class="layui-col-xs7">
                            <label class="layadmin-user-login-icon layui-icon layui-icon-vercode"
                                for="LAY-user-login-vercode"></label>
                            <input type="text" name="vercode" id="LAY-user-login-vercode" placeholder="图形验证码"
                                class="layui-input" v-model="code">
                        </div>
                        <div class="layui-col-xs5">
                            <div style="margin-left: 10px;">
                                <img :src="captcha" @click="getCaptcha" class="layadmin-user-login-codeimg"
                                    id="LAY-user-get-vercode">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item" style="margin-bottom: 20px;">
                    <input type="checkbox" name="remember" lay-skin="primary" title="记住密码">
                    <div class="layui-unselect layui-form-checkbox" lay-skin="primary"><span>记住密码</span><i
                            class="layui-icon layui-icon-ok"></i>
                    </div>
                    <a lay-href="/user/forget" class="layadmin-user-jump-change layadmin-link"
                        style="margin-top: 7px;">忘记密码？</a>

                </div>
                <div class="layui-form-item">
                    <button class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="LAY-user-login-submit"
                        @click="login">登 录</button>
                </div>
                <div class="layui-trans layui-form-item layadmin-user-login-other" style="display:none;">
                    <label>社交账号登录</label>
                    <a href="javascript:;"><i class="layui-icon layui-icon-login-qq"></i></a>

                    <a href="javascript:;"><i class="layui-icon layui-icon-login-wechat"></i></a>

                    <a href="javascript:;"><i class="layui-icon layui-icon-login-weibo"></i></a>

                    <a lay-href="/user/reg" class="layadmin-user-jump-change layadmin-link">注册帐号</a>
                </div>
            </div>
        </div>
    </div>
</body>
{include file="public/foot"/}
<script>
    if (top != self) {
        parent.location.href = location.href;
    }
    var app = new Vue({
        el: ".root_box",
        data: {
            user_account: "",
            user_password: "",
            captcha: "",
            token: "",
            code: ""
        },
        created: function () {
            this.getCaptcha();
        },
        methods: {
            getCaptcha: function () {
                var that = this;
                $.post("/api/system/getCaptcha", {},
                    function (data, status) {
                        if (data.code == 200) {
                            that.captcha = 'data:image/jpg;base64,' + data.data.img;
                            // console.log(data.data.code);
                            that.token = data.data.token;
                        } else {
                            _alert(data.msg);
                        }
                    });
            },
            login: function () {
                var postData = PostCommon;
                postData.user_account = this.user_account;
                postData.user_password = this.user_password;
                postData.token = this.token;
                postData.code = this.code;
                $.post("/api/user/login", postData,
                    function (data, status) {
                        if (data.code == 200) {
                            location.href = '{$callback}';
                        } else {
                            _alert(data.msg);
                        }
                    });
            }
        }
    });
</script>

</html>